import _ from 'underscore';

import {parseToChart2,restPostApi} from '../apis/core-util'

export default class PerformaceScope {
  constructor(container) {
    this.container = container;
    this.$state = {
      performanceChartKey: null,
      performanceLeftSelectedValue: 'CRASH_RATE',
      performanceRightSelectedValue: 'DAILY_ACTIVE',
      performanceList: [
        {
          label: '平均响应时间',
          value: 'AVG_RESPONSETIME' // 秒
        }, {
          label: '传输数据量',
          value: 'TRANSFER_BYTE' // 整数，字节
        }, {
          label: '网络错误率',
          value: 'NET_ERROR_RATE' // 百分比小数
        }, {
          label: '活跃用户',
          value: 'DAILY_ACTIVE' // 整数
        }, {
          label: '崩溃次数',
          value: 'CRASH' // 百分比小数
        }, {
          label: '崩溃率',
          value: 'CRASH_RATE' // 秒
         }
      ],

      performanceDisplayType: 'line', // line = 折线图&折线图; column = 柱状图&柱状图
      performanceDataSource:{
        loading:true
      },
      performanceChartHeight:0
    };

    if (!BlueWare.crashRateSupported && BlueWare.isIOS) {
      this.$state.performanceList = _.filter(this.$state.performanceList, p => p.value !== 'CRASH_RATE');
      this.$state.performanceLeftSelectedValue = 'CRASH';
    }

    this.performanceApi = restPostApi({
      __url: 'http/stat/'+ BlueWare.appId + '/performance',
      __type: 'double-common',
      viewKey: () => [
        'performance_'+this.$state.performanceLeftSelectedValue,
        'performance_'+this.$state.performanceRightSelectedValue
      ],
      appVersionId: ()=>BlueWare.appVersionId,
      appOSType:BlueWare.platform.toUpperCase(),
      dateType:()=>this.container.dateType,
      leftIndex:()=>this.$state.performanceLeftSelectedValue,
      rightIndex:()=>this.$state.performanceRightSelectedValue
    });
  } // constructor

  $performance_list_left_changing(payload) {
    this.$state.performanceLeftSelectedValue = payload.value;
    this.fetch();
  } // $performance_list_left_changing

  $performance_list_right_changing(payload) {
    this.$state.performanceRightSelectedValue = payload.value;
    this.fetch();
  } // $performance_list_right_changing

  $toggle_performance_display_type() {
    this.$state.performanceDisplayType = this.$state.performanceDisplayType === 'line' ? 'column' : 'line';
    this.fetch();
  } // $toggle_performance_display_type

  $performance_resize(payload) {
    if ((this.$state.performanceChartHeight + 2) !== payload.current.height) {
      this.$state.performanceChartHeight = payload.current.height + 2;
      this.refreshChartKey();

      this.container.emit();
    }
  } // $performance_resize

  fetch() {
    this.performanceApi.fetch().done((data, params) => {
      this.refreshChartKey();
      this.$state.performanceDataSource = {
        data: parseToChart2(data, params, {
          formatter: function (formattedValue, options) {
            return `<div style="color: ${ this.axis.series[0].color }">${ formattedValue }</div>`;
          }
        })
      };

      let yAxisList = this.$state.performanceDataSource.data.yAxis;

      let leftMaxYAxisValue = _.reduce(this.$state.performanceDataSource.data.series[0].data, (x, y) => x > y.y ? x : y.y, 0);
      yAxisList[0].max = this.$state.performanceLeftSelectedValue === 'NET_ERROR_RATE' ||
                         this.$state.performanceLeftSelectedValue === 'CRASH_RATE'
                          ? (leftMaxYAxisValue >= 1 ? 1 : (leftMaxYAxisValue === 0 ? 1 : leftMaxYAxisValue)) : null;

      let rightMaxYAxisValue = _.reduce(this.$state.performanceDataSource.data.series[1].data, (x, y) => x > y.y ? x : y.y, 0);
      yAxisList[1].max = this.$state.performanceRightSelectedValue === 'NET_ERROR_RATE' ||
                         this.$state.performanceRightSelectedValue === 'CRASH_RATE'
                          ? (rightMaxYAxisValue >= 1 ? 1 : (rightMaxYAxisValue === 0 ? 1 : rightMaxYAxisValue)) : null;

      this.container.emit();
    }).fail((error, params) => {
      this.$state.performanceDataSource = {error};

      this.container.emit();
    }).progress(()=>{
      this.$state.performanceDataSource = {loading: true};

      this.container.emit();
    });
  } // fetch

  refreshChartKey() {
    this.$state.performanceChartKey = 'performanceChartKey-'+new Date().getTime();
  } // refreshChartKey

  $load() {
    this.fetch();
  } // $load
}
